<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
		div{
			margin: 0 auto;
			border: 1px solid red;
			width: 300px;
			height: 300px;
		}
	    button{
	    	border-radius: 10px;
	    	margin: 10px 10px;
	    	background-color: #cccc;
	    	color: red; 
	    }
	</style>
</head>
<body>
  <div>
  	<button>未接</button>
  	<button>未接</button>
  	<button>未接</button>
  	<button>未接</button>
  </div>
  <script type="text/javascript" src="json/jquery3.js"></script>
   <script type="text/javascript">
    function rhjf(tr){
    var whh=$(tr).val();
    console.log(whh);
   }
   	function fjafh(){
   	$('div').empty();
   	$.get('json/r.json',function(rsd) {
   		
   		for (var i = 0; i < rsd.length; i++) {
   			var www='<button onclick="rhjf(this)" value="'+rsd[i].id+'">'+rsd[i].name+'</button>';
   			$(' div').append(www);
        // console.log(www);
   		}
   	})
   }
   
   fjafh();
   </script>
</body>
</html>